.file-editor
  = form_tag(project_edit_tree_path(@project, @id), method: :put, class: "form-horizontal") do
    .file_holder
      .file_title
        %i.icon-file
        %span.file_name
          = @path
          %small
            on
            %strong= @ref
        %span.options
          .btn-group.tree-btn-group
            = link_to "Cancel", project_blob_path(@project, @id), class: "btn btn-tiny btn-cancel", confirm: "Are you sure?"
      .file_content.code
        %pre#editor= @blob.data

    .control-group.commit_message-group
      = label_tag 'commit_message', class: "control-label" do
        Commit message
      .controls
        = text_area_tag 'commit_message', '', placeholder: "Update #{@blob.name}", required: true, rows: 3
    .form-actions
      = hidden_field_tag 'last_commit', @last_commit
      = hidden_field_tag 'content', '', id: :file_content
      .commit-button-annotation
        = button_tag "Commit", class: 'btn commit-btn js-commit-button'
        .message
          to branch
          %strong= @ref
      = link_to "Cancel", project_tree_path(@project, @id), class: "btn btn-cancel", confirm: "Are you sure?"

:javascript
  ace.config.set("modePath", "#{Gitlab::Application.config.assets.prefix}/ace-src-noconflict")
  var ace_mode = "#{@blob.language.try(:ace_mode)}";
  var editor = ace.edit("editor");
  if (ace_mode) {
    editor.getSession().setMode('ace/mode/' + ace_mode);
  }

  disableButtonIfEmptyField("#commit_message", ".js-commit-button");

  $(".js-commit-button").click(function(){
    $("#file_content").val(editor.getValue());
    $(".file-editor form").submit();
  });
